import React from 'react';
import { Divider, Table, Typography } from 'antd';
import ProTable, { ProColumns } from '@ant-design/pro-table';

const GoodsInfo: React.FC<{
  goodsList?: any[]; 
  title: string; 
  applyInfo: Object;
  type?: number;
}> = (props) => {
  const { goodsList, title, type } = props;
  const columns: ProColumns<any>[] = [
    {
      title: '品牌',
      dataIndex: 'brand_name'
    },
    {
      title: '名称',
      dataIndex: 'shop_goods_name',
      width: 250,
    },
    {
      title: '编号',
      dataIndex: 'goods_id'
    },
    {
      title: '规格',
      dataIndex: 'specs_desc',
      width: 250,
    },
    {
      title: '购买数量',
      align: 'right',
      dataIndex: 'goods_num'
    },
    {
      title: '退货数量',
      align: 'right',
      dataIndex: 'refund_num',
      render: (val, record) => {
        if (val > 0) {
          return <span className='red'>{val}</span>
        }
        return val;
      }
    },
    {
      title: '单价',
      align: 'right',
      valueType: 'money',
      dataIndex: 'selling_price'
    },
    {
      title: '小计',
      align: 'right',
      valueType: 'money',
      dataIndex: 'total_selling_price',
      render: (dom, entity) => {
        return Number(entity.refund_num * entity.selling_price).toFixed(2)
      }
    }
  ];
console.log('aaaa_type', type)
  return <div className="service-record after-record">
     <div className="header">
        <div className="title">{title}</div>
      </div>
      <Divider style={{margin: '10px 0 0'}}  />
      
      <ProTable 
        rowKey="record_id" 
        bordered
        style={{ marginTop: -5 }}
        dataSource={goodsList} 
        search={false} 
        options={false} 
        columns={columns} 
        pagination={false}
        summary={pageData => {
          let totalAmount = 0
          let goodsNum = 0
          pageData.forEach(({ total_refund_price, goods_num, refund_num }) => {
            totalAmount += Number(total_refund_price)
            goodsNum += Number(refund_num)
          })
          return (
            <>
              <Table.Summary.Row>
                <Table.Summary.Cell align="right" colSpan={8} index={1}>
                  {
                    type !== 2 && <>商品数量： <Typography.Text strong type="danger">{goodsNum}</Typography.Text></>
                  }
                  
                  <span style={{padding: '0 10px'}}></span>
                  合计： <Typography.Text strong type="danger">¥{totalAmount.toFixed(2)}</Typography.Text>
                </Table.Summary.Cell>
              </Table.Summary.Row>
            </>
          )
        }} />
  </div>
}

export default GoodsInfo;